
'use client'

import React, { useEffect, useState } from 'react'
import axios from 'axios'

import columns from '@/app/(configure)/_Tablecolun/colum'
import pool from '@/app/lib/db'
import { Button, Input, message, Table } from 'antd'
export default function page() {
  const [datavalue,setdatavalue]=useState([])
  const [datav,setdatav]=useState("")
  const [bzv,setbzv]=useState("")
  useEffect(()=>{
    
   const timeer= setInterval(async()=>{ 
    


//  function fetchDataFromPostgres() {
//     'use server';
   
//     try {
//         // 执行一个查询语句，例如从 users 表中查询数据
//         const result =  pool.query('SELECT * FROM  vincty');
//         return result.rows;
//     } catch (error) {
//         console.error('Error fetching data from Postgres:', error);
//         throw new Error('Failed to fetch data from Postgres');
//     }
// }
axios.get('/api').then(res=>{
    setdatavalue(res.data)

})

  
   }
 ,10000)
     return ()=>{
      clearInterval(timeer)
     }
  })
  const  submitdata=()=>{
    if(datav===""){
      message.info("用户名不能是空")
    }else{
      axios.post("http://node.dayuan0307.top:300/victy/reg",{name:datav,bz:bzv}).then(res=>{
      
          console.log(res.data)
          message.success("添加成功")
          setdatav("")
          setbzv("")
          axios.get("http://node.dayuan0307.top:300/victy/query").then(res=>{
            setdatavalue(res.data)

            
          })
       
      })
    }
  }
  return (
    <div>
      <div><h1>第五城信息</h1></div>
      <div>
        用户名：<Input   value={datav}   onChange={(e)=>{setdatav(e.target.value)}}  style={{width:"150px", marginLeft:"10px",marginRight:"25px"}} />
        备注：<Input   value={bzv}   onChange={(e)=>{setbzv(e.target.value)}}  style={{width:"150px", marginLeft:"10px",marginRight:"25px"}} />
        <Button type="primary" onClick={submitdata}> 添加用户</Button>
      </div>
      <div><Table columns={columns} dataSource={datavalue}></Table></div>
 

      
    </div>
  )
}
